.pop{//弹出层
    padding: 30rpx;
    text-align: center;
    background-color: #ffffff;
    font-family: "Microsoft YaHei";
    .pop_delete{
        color: red;
    }
}

.st_area{//骨架区
    display: flex;
    width: 100%;
    padding-top: 20rpx;
    .st_area_left{
        flex: 1;
        .st_area_left_avatar{
            width: 80rpx;
            height: 80rpx;
            border-radius: 100rpx;
            background-color: #EDEDED;
        }
        
    }
    .st_area_right{
        flex: 4;
        display: flex;
        flex-direction: column;
        .st_area_right_name{
            width: 40%;
            height: 28rpx;
            background-color: #EDEDED;
            // margin-left: 20rpx;
        }
        .st_area_right_content{
            height: 30rpx;
            width: 100%;
            background-color: #eaeaea;
            margin-top: 20rpx;
            // margin-left: 20rpx;
        }
        .st_area_right_other{
            margin-top: 40rpx;
            margin-bottom: 10rpx;
            // margin-left: 20rpx;
            width: 100rpx;
            height: 25rpx;
            background-color: #F5F5F7;
            justify-content: flex-start;
            align-items: center;
        }
    }
}

.detail_wrap{
    padding: 20rpx;
    .report{
        image{
            width: 50rpx;
            height: auto;
            position: absolute;
            right: 40rpx;
            top: 30rpx;
        }
    }
    .detail_header{
        margin-top: 10rpx;
        .header_title{
            width: 90%;
            font-weight: bold;
            font-size: 40rpx;
        }
        .header_info{
            display: flex;
            padding-top: 30rpx;
            justify-content: center;
            align-items: flex-start;
            .info_avatar{
                image{
                    width: 80rpx;
                    height: auto;
                    border-radius: 100rpx;
                } 
            }
            .info_user{
                flex: 5;
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                padding-left: 30rpx;
                .user_wrap{
                    flex: 2;
                    display: flex;
                    justify-content: space-around;
                    align-items: center;
                    position: relative;
                    .user_title{
                        flex: 4;
                        font-size: 32rpx;
                        color:darkslategray;
                        white-space: nowrap;
                    }
                }
                .user_time{
                    flex: 1;
                    font-size: 24rpx;
                    color: #101010;
                    padding-top: 10rpx;
                }
            }
        }
    }
    .detail_content{
        margin-top: 20rpx;
        width: 100%;
        background-color: #fff;
        font-size: 34rpx;
        font-family: "Microsoft YaHei";
        letter-spacing: 1rpx;
        image{
            width: 100%;
            height: auto;
            margin-top: 20rpx;
        }
    }
    
}
.special_span{
    width: 100%;
    height: 34rpx;
    background: #EDEDED;
}
.detail_tail{
    padding: 30rpx;
    .comment_content{
        background-color: #fff;
        .comment_content_wrap{
            .comment_item{
                display: flex;
                width: 100%;
                padding-top: 20rpx;
                // border-bottom: 1rpx solid #ccc;
                .user_wrap{//左半边
                    flex: 1;
                    display: flex;
                    image {//头像
                        width: 80rpx;
                        height: auto;
                        border-radius: 100rpx;
                    }
                }
                .comment_right{//右半边
                    flex: 4;
                    display: flex;
                    flex-direction: column;
                    justify-content: space-around;
                    .user_name{//用户名
                        font-size: 36rpx;
                        
                        font-weight: bold;
                        display: flex;
                        color: #004660;
                        padding-left: 20rpx;
                        white-space: nowrap;
                        overflow: hidden;
                        text-overflow: ellipsis;
                        .report_it{
                            position: absolute;
                            right: 40rpx;
                            image{
                                height: auto;
                                width: 50rpx;
                            }
                        }
                    }
                    .other_comment{//其他人的评论
                        margin-top: 20rpx;
                        margin-left: 20rpx;
                        margin-right: 20rpx;
                        width: 480rpx;
                        padding: 20rpx;
                        color: #636161;
                        background-color: #EDEDED;
                    }
                    .user_comment{//评论内容
                        font-size: 34rpx;
                        margin-top: 20rpx;
                        margin-left: 20rpx;
                    }
                    .user_comment_image{//评论的照片
                        margin-top: 20rpx;
                        margin-left: 20rpx;
                        image{
                            min-width: 200rpx;
                            max-width: 400rpx;
                            border-radius: 0;
                            height: auto;
                        }
                        
                    }
                    .comment_info{//时间等
                        color: #ccc;
                        font-size: 30rpx;
                        display: flex;
                        margin-top: 10rpx;
                        margin-bottom: 10rpx;
                        margin-left: 20rpx;
                        justify-content: flex-start;
                        align-items: center;
                      .date{
                        flex: 1;
                      }
                      .time{
                        flex: 1;
                        margin-left: -398rpx
                      }
                      .huifu{
                        flex: 1;
                        margin-left: -350rpx
                      }
                      .good{
                        position:absolute;
                        right: 100rpx;
                        align-items: center;
                        image{
                            width: 40rpx;
                            height: auto;
                        }
                        .good_num{
                            // flex: 3;
                            position:absolute;
                            padding-left: 10rpx;
                            bottom: 8rpx;
                            font-size: 30rpx;
                        }
                    }
                    }
                }
                
            }
        }
    }
    .comment_wrap{//评论框
        position: fixed;
        display: flex;
        bottom: 0;
        left: 0;
        width: 100%;
        justify-content: center;
        align-items: center;
        background-color: #FFFFFF;
        height: 70rpx;
        padding: 20rpx;
        border-top: 2rpx solid #ccc;
        input[type='text']{//输入框
            flex: 8;
            background-color: #fff;
            padding-left: 20rpx;
            border: 1rpx solid #666;
            border-radius: 20rpx;
            height: 60rpx;
        }
        .addimage
        {
            flex: 1;
            display: flex;
            padding-left: 25rpx;
            justify-content: center;
            align-items: center;
            image{
                width: 50rpx;
            }
        }
        .star{
            flex: 2;
            display: flex;
            padding-right: 30rpx;
            justify-content: center;
            align-items: center;
            image{
                width: 40%;
            }
            .star_num{
                padding-left: 5rpx;
                font-size: 30rpx;
            }
        }
    }
    .mask{
        width: 100%;
        height: 100rpx;
        background-color: transparent;
    }
}